<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>GMIP</title>
	<link rel="stylesheet" type="text/css" href="easyui.css">
	<link rel="stylesheet" type="text/css" href="demo.css">
	<script type="text/javascript" src="jquery.min.js"></script>
	<script type="text/javascript" src="jquery.easyui.min.js"></script>
</head>
<body class="easyui-layout">
	<div data-options="region:'north',border:true" style="height:200px;">
		<div class="easyui-layout" data-options="fit:true">
                <div data-options="region:'north',fit:true,border:false, href:'header_2.html'" style=""></div>
                <div data-options="region:'center',border:false" style="height:100px"></div>
                <div data-options="region:'south',split:true,border:false" style="height:100px"></div>
            </div>
	</div>
	<div data-options="region:'west',split:true,title:'West'" style="width:200px;padding:10px;height:300px">
		View Reports, Build Reports
	</div>
	<div data-options="region:'south',border:false,href:'footer.html'" style="height:230px;"></div>
	<div data-options="region:'center',title:'Center'" >
	
		
	</div>
	<script type="text/javascript">
        $(function(){
            $('#cc').layout();
            setHeight();
        });
        
        
        function setHeight(){
            var c = $('#cc');
            var p = c.layout('panel','center'); // get the center panel
            var oldHeight = p.panel('panel').outerHeight();
            p.panel('resize', {height:'auto'});
            var newHeight = p.panel('panel').outerHeight();
            c.height(c.height() + newHeight - oldHeight);
            c.layout('resize');
        }
    </script>
</body>
</html>